﻿<%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

<%@ Import Namespace="Equipment.DataAccess" %>
<%@ Import Namespace="Equipment.Business" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Create Work Order
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="CurrentMenuIDContent" runat="server">
    woMenu</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="HeadContent" runat="server">
    <link rel="stylesheet" type="text/css" href="../../Content/anytime.css" />
    <link rel="stylesheet" type="text/css" href="../../Content/jquery-ui-1.8.16.custom.css" />
    <link rel="stylesheet" type="text/css" href="../../Content/jquery.autocomplete.css" />
    <script type="text/javascript" src="../../Scripts/site.js"></script>
    <script type="text/javascript" src="../../Scripts/jquery-ui-1.8.16.custom.min.js"></script>
    <script type="text/javascript" src="../../Scripts/jquery.autocomplete.min.js"></script>
    <script type="text/javascript" src="../../Scripts/anytime.js"></script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <h2>
        Create Work Order</h2>
    <br />
    <% Dim currAsset As Asset = ViewData("BasedOnAsset")%>
    <% Using Html.BeginForm()%>
    <%= Html.ValidationSummary(False) %>
    <fieldset>
        <legend>Work Order</legend>
        <table>
            <tr>
                <th class="top">
                    Select Asset:<br />
                    <br />
                    <input type="radio" name="searchWay" checked="checked" onclick="showSearchPanel();" />&nbsp;Using
                    search field<br />
                    <input type="radio" name="searchWay" onclick="showFilterPanel();" />&nbsp;Using
                    filter<br />
                </th>
                <td class="top">
                    <div id="searchPanel">
                        <%= Html.TextBox("txtAssetName", currAsset.AssetName, New With {.class = "text normal-width"})%>
                        <%= Html.Hidden("hfAssetID", currAsset.AssetID)%>
                        <br />
                        <small>Enter Asset Name or Asset ID to search.</small>
                    </div>
                    <div id="filterPanel" class="hidden">
                        <%= Html.DropDownList("FilterSite", "Select Site...")%>
                        <br />
                        <span id="filterDepContainer"></span>
                        <br />
                        <span id="assetTypeContainer"></span>
                        <br />
                        <span id="assetContainer"></span>
                    </div>

                    <script type="text/javascript">
                        function getFilterDepartmentsDepartment() {
                            showLoading("filterPanel", true);
                            var siteID = $("#FilterSite").val();
                            if (siteID === "") {
                                $('#filterDepContainer').html("");
                                $('#assetTypeContainer').html("");
                                $('#assetContainer').html("");
                                hideLoading("filterPanel");
                                return;
                            }
                            jQuery.ajax({
                                type: 'POST',
                                data: { siteID: siteID },
                                url: '<%= Html.AttributeEncode(Url.Action("GetDepartmentDDBySiteID")) %>',
                                success: function (result) {
                                    $('#filterDepContainer').html(result);
                                    $('#assetTypeContainer').html("");
                                    $('#assetContainer').html("");
                                    $("#Department").change(function () {
                                        getAssetTypesByDepartment();
                                    });
                                    hideLoading("filterPanel");
                                }
                            });
                        }

                        function getAssetTypesByDepartment() {
                            showLoading("filterPanel", true);
                            var locId = $("#Department").val();
                            if (locId === "") {
                                $('#assetTypeContainer').html("");
                                $('#assetContainer').html("");
                                hideLoading("filterPanel");
                                return;
                            }
                            jQuery.ajax({
                                type: 'POST',
                                data: { id: locId },
                                url: '<%= Html.AttributeEncode(Url.Action("GetAssetTypesByDepartment")) %>',
                                success: function (result) {
                                    $('#assetTypeContainer').html(result);
                                    $('#assetContainer').html("");
                                    $("#FilterAssetType").change(function () {
                                        getAssetNamesByDepartment();
                                    });
                                    hideLoading("filterPanel");
                                }
                            });
                        }

                        function getAssetNamesByDepartment() {
                            showLoading("filterPanel", true);
                            var atId = $("#FilterAssetType").val();
                            var locId = $("#Department").val();
                            if (atId === "" || locId === "") {
                                hideLoading("filterPanel");
                                return;
                            }
                            jQuery.ajax({
                                type: 'POST',
                                data: { id: locId, typeID: atId },
                                url: '<%= Html.AttributeEncode(Url.Action("GetAssetsByDepartmentAndType")) %>',
                                success: function (result) {
                                    $('#assetContainer').html(result);
                                    $("#FilterAssetName").change(function () {
                                        var id = $("#FilterAssetName").val();
                                        getAssetByID(id);
                                    });
                                    hideLoading("filterPanel");
                                }
                            });
                        }

                        function getAssetByID(id) {
                            jQuery.ajax({
                                type: 'POST',
                                data: { id: id },
                                url: '<%= Html.AttributeEncode(Url.Action("GetAssetByID")) %>',
                                dataType: "json",
                                success: function (asset) {
                                    selectAsset(asset);
                                }
                            });
                        }
                </script>
                
                </td>
                <td colspan="2">
                    <table>
                        <tr>
                            <th>
                                Asset Id:
                            </th>
                            <td>
                                <span id="lblAssetID">
                                    <%If currAsset.AssetID <> 0 Then%>
                                    <%:currAsset.AssetID %>
                                    <%End If%>
                                </span>
                            </td>
                            <th>
                                Model #:
                            </th>
                            <td>
                                <span id="lblAssetModelNo">
                                    <%: currAsset.ModelNo%></span>
                            </td>
                        </tr>
                        <tr>
                            <th>
                                Asset Name:
                            </th>
                            <td>
                                <span id="lblAssetName">
                                    <%: currAsset.AssetName%></span>
                            </td>
                            <th>
                                Serial #:
                            </th>
                            <td>
                                <span id="lblAssetSerialNo">
                                    <%: currAsset.SerialNo%></span>
                            </td>
                        </tr>
                        <tr>
                            <th>
                                Asset Type:
                            </th>
                            <td>
                                <span id="lblAssetType">
                                    <%: currAsset.AssetType.Description%></span>
                            </td>
                            <td>
                                &nbsp;
                            </td>
                            <td>
                                &nbsp;
                            </td>
                        </tr>
                        <tr>
                            <th>
                                Department:
                            </th>
                            <td>
                                <span id="lblAssetDepartment">
                                    <%: currAsset.SiteDepartment.Description%></span>
                            </td>
                            <td>
                                &nbsp;
                            </td>
                            <td>
                                &nbsp;
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <th class="top">
                    Select Requirement:
                </th>
                <td id="reqListContent" colspan="3">
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td id="reqContent" colspan="4">
                    &nbsp;
                </td>
            </tr>
        </table>
    </fieldset>
    <div>
        <%: Html.ActionLink("Back to List", "Index") %>
    </div>
    <% Html.RenderPartial("~/Views/WorkOrder/Dialogs/WorkOrderAuthenticationDialog.ascx")%>
    <% End Using%>
    <script type="text/javascript">
        $(document).ready(function () {

            $("#txtAssetName").autocomplete('<%: Url.Action("SearchAssetByNameAndID") %>', {
                matchContains: true,
                minChars: 1,
                cacheLength: 0,
                maxItemsToShow: 15,
                dataType: 'json',
                parse: function (data) {
                    var parsed = [];
                    if (data === null) {
                        data = [];
                    }
                    for (var i = 0; i < data.length; i++) {
                        parsed[parsed.length] = {
                            data: data[i],
                            value: data[i].AssetID,
                            result: data[i].AssetName
                        };
                    }
                    return parsed;
                },
                formatItem: function (item) {
                    return item.AssetName;
                },
                width: 300
            }).result(function (e, data) {
                selectAsset(data);
            });

            $("#FilterSite").change(function () {
               getFilterDepartmentsDepartment();
            });

            <% If currAsset.AssetID > 0 %>
            getReqListByAssetTypeID(<%: currAsset.AssetTypeID%>);
            <% End If %>

        });

        function validate(){
            var state = true; 
            $("#sError").html("");
            $("#ReviewGroupContainer").removeClass("input-validation-error");
            $("#GroupContainer").removeClass("input-validation-error");
            if($("#txtDate").val() == "" ){
                $("div.calendar-field").append("<span id = 'emsg' class = 'field-validation-error'> *</span>");
                $("#sError").append("<span id = 'emsg' class = 'field-validation-error'> Required Date&Time</span><br>");
                state = false;
            }
            if ($("#GroupContainer input:checkbox[checked]").length == 0){
                        $("#sError").append("<span id = 'emsg' class = 'field-validation-error'> Required Assigned Group</span><br>");
                        $("#GroupContainer").addClass("input-validation-error");
                        state = false;
                    }
            if ( $("#ReviewType").val() != "NotRequired"  ){
                    if ($("#ReviewGroupContainer input:checkbox[checked]").length == 0){
                        $("#sError").append("<span id = 'emsg' class = 'field-validation-error'> Required Review Group</span><br>");
                        $("#ReviewGroupContainer").addClass("input-validation-error");
                        state = false;
                    }
            }
            if (state){
             return AuthenticationForWorkOrder();
            }
            return false;
        }

       

        function selectAsset(asset) {
            $("#hfAssetID").val(asset.AssetID);
            $("#lblAssetID").text(asset.AssetID);
            $("#lblAssetName").text(asset.AssetName);
            $("#lblAssetModelNo").text(asset.ModelNo);
            $("#lblAssetSerialNo").text(asset.SerialNo);
            $("#lblAssetDepartment").text(asset.SiteDepartment);
            $("#lblAssetType").text(asset.AssetType);
            getReqListByAssetTypeID(asset.AssetTypeID);
        }

        function getReqListByAssetTypeID(id) {
         showLoading("reqListContent", true);
            jQuery.ajax({
                type: 'POST',
                data: { assetTypeID: id },
                url: '<%= Html.AttributeEncode(Url.Action("RequirementList")) %>',
                success: function (result) {
                    $('#reqListContent').html(result);
                    //$('#reqContent').html("");
                    hideLoading("reqListContent");
                }
            });
        }

        function selectRequirement(id) {
        showLoading("reqContent", true);
        var assetID = $("#lblAssetID").text();
        $("#txtDate").AnyTime_noPicker().remove();
            jQuery.ajax({
                type: 'POST',
                data: { reqID: id, assetID: assetID},
                url: '<%= Html.AttributeEncode(Url.Action("WorkOrderContent")) %>',
                success: function (result) {
                    $('#reqContent').html(result);
                    $('#txtDate').AnyTime_picker(
                      { format: "%Y-%m-%d %h:%i %p"} );
                    $("select#DepartmentSource").change(function () {
                        loadDepartmentGroups();
                    });
                    $("select#ReviewDepartmentSource").change(function () {
                        loadReviewDepartmentGroups();
                    });
                      
                    hideLoading("reqContent");
                }
            });
        }

        function loadReviewDepartmentGroups(){
            var depID= $('#ReviewDepartmentSource').val();
            jQuery.ajax({
                type: 'POST',
                data: { depID: depID},
                url: '<%= Html.AttributeEncode(Url.Action("GetReviewGroupsByDepartmentID")) %>',
                success: function (result) {
                    $('#ReviewGroupContainer').html(result);
                }
            });
        }


        function loadDepartmentGroups(){
            var depID= $('#DepartmentSource').val();
            jQuery.ajax({
                type: 'POST',
                data: { depID: depID},
                url: '<%= Html.AttributeEncode(Url.Action("GetGroupsByDepartmentID")) %>',
                success: function (result) {
                    $('#GroupContainer').html(result);

                }
            });
        }

        function showSearchPanel() {
            $("#filterPanel").hide();
            $("#searchPanel").show();
        }

        function showFilterPanel() {
            $("#searchPanel").hide();
            $("#filterPanel").show();
        }
     </script>
</asp:Content>
